<template>
    <el-container class="index-container">
      <el-aside style="width: 225px; height: 830px;">
        <Nav></Nav>
      </el-aside>
      <el-container>
        <el-header>
          <Header></Header>
        </el-header>
        <el-main>
          <transition>
            <keep-alive>
              <router-view :key="$route.fullPath"></router-view>
            </keep-alive>
          </transition>
        </el-main>
        <el-footer>
          <Footer></Footer>
        </el-footer>
      </el-container>
    </el-container>
</template>


<script>
import Nav from "../components/admin/nav";
import Footer from "../components/admin/Footer";
import Header from "../components/admin/Header";
export default {
  name: "admin",
  components: {Nav, Footer, Header},

}
</script>

<style scoped>
.container{
  height: 100%;
}
 .el-header, .el-footer {
  background-color: lightskyblue;
  color: #333;
  text-align: center;
  line-height: 60px;
}
.layout-contant{
  width: 100px;
}
.el-aside {
  background-color: lightskyblue;
  text-align: center;
  width: 250px;
}

.el-main {
  background-color: #E9EEF3;
  color: #333;
  text-align: center;
  line-height: 50px;
  height: 500px;
}


</style>
